const { resolve } = require('path')
const prod = require('./webpack.prod')
module.exports = {
  // 由于开发环境和生产环境很多配置项是一致的.所以直接导入生产环境的配置信息,然后解构
  ...prod,
  // 开发环境下,mode是development,会覆盖prod中的mode
  mode: 'development',
  devServer: {
    static: {
      directory: resolve(__dirname, '../public'),
    },
    port: 9001,
    open: true,
    historyApiFallback: true, // 解决前端路由中找不到页面的问题（不管浏览器请求地址的路径是什么,一律按照路径为/处理）
    // 配置代理: 让开发服务器帮我们转发请求,从而解决跨域问题
    proxy: {
      // 发送给开发服务器的请求url中的路径必须是/api开头的才可以代理
      '/api': {
        target: 'http://localhost:5001', // 告诉开发服务器,转发请求时,目标地址是什么
        // 默认开发服务器,会将代理的请求的路径和target直接拼接,发给目标服务器之后,路径是错误的.所以要告诉开发服务器,转发请求时,应该去掉/api
        pathRewrite: { '^/api': '' }, //将url中/api替换掉
      },
    },
  },
}
